<template>
    <p style="white-space: pre-line;"></p>
    <el-card style="width: 100%">
        <template #header>
            <div class="card-header">
                <h1>第{{ information.id }}题</h1>
                <span>题目是。。。。</span>
            </div>
        </template>
        <el-radio-group v-model="picked" class="ml-4 " style="display: block;">
            <div class="mb-2  text-sm">
                <el-checkbox class="radio-option" v-model="checked1" label="Option 1" value="A" size="large" border>A:
                    {{
                    information.optionA }}</el-checkbox>
                <el-checkbox class="radio-option" v-model="checked1" label="Option 1" value="B" size="large" border>B:
                    {{
                    information.optionB }}</el-checkbox>
                <el-checkbox class="radio-option" v-model="checked1" label="Option 1" value="C" size="large" border>C:
                    {{
                    information.optionC }}</el-checkbox>
                <el-checkbox class="radio-option" v-model="checked1" label="Option 1" value="D" size="large" border>D:
                    {{
                    information.optionD }}</el-checkbox>
            </div>
        </el-radio-group>
    </el-card>

</template>
<script>
export default {
    data() {
        return {

            picked: ''
        }
    },
    props: {
        information: { type: String, required: true }
    },
}

</script>
<style scoped>
.radio-option {  
    width: 100%;
  /* 如果您希望添加一些垂直间距，可以使用 margin */  
  margin-bottom: 10px; /* 例如，10px 的垂直间距 */  
} 

</style>